<!DOCTYPE html>
<!-- saved from url=(0050)https://huodong.m.taobao.com/act/layouttestvw.html -->
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
  <title>布局方案测试页面</title>
  <!-- <meta content="a1z3i" name="data-spm"> -->
  <!-- <meta content="20140614.a1z3i.mgi7t123d7" name="data-scm"> -->
  <!-- <link type="image/x-icon" href="https://gw.alicdn.com/mt/TB1AElnKVXXXXc8XXXXXXXXXXXX-40-40.jpg" rel="Shortcut Icon"> -->
  <style type="text/css">
    body,
    html {
      margin: 0;
      padding: 0
    }

    html {
      width: 100vw;
      height: 100vh
    }

    body {
      min-height: 100%;
      background-color: #f4f4f4
    }

    *,
    :after,
    :before {
      box-sizing: border-box
    }

    li,
    ul {
      list-style: none outside none;
      margin: 0;
      padding: 0
    }

    figure {
      display: block;
      margin: 0
    }

    img {
      width: 100%;
      height: auto;
      vertical-align: top
    }

    [aspectratio] {
      position: relative
    }

    [aspectratio]:before {
      content: "";
      display: block;
      width: 1px;
      margin-left: -1px;
      height: 0
    }

    [aspectratio-content] {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%
    }

    [flexContainer] {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: 100vw
    }

    .block {
      margin-top: 2vw
    }

    [w-750-235] {
      width: 100vw
    }

    [w-375-224] {
      width: 50vw
    }

    [w-499-250] {
      width: 66.53333vw;
      padding-right: 1px
    }

    [w-250-250] {
      width: 33.33333vw
    }

    [w-375-246] {
      width: 50vw
    }

    [w-750-250] {
      width: 100vw
    }

    [w-188-246] {
      width: 25.06667vw
    }

    [w-187-246] {
      width: 24.93333vw
    }

    [aspectratio][aspect-ratio="188/246"]:before {
      padding-top: 130.85106382978725%
    }

    [aspectratio][aspect-ratio="750/250"]:before {
      padding-top: 33.33333333333333%
    }

    [aspectratio][aspect-ratio="375/246"]:before {
      padding-top: 65.60000000000001%
    }

    [aspectratio][aspect-ratio="250/250"]:before {
      padding-top: 100%
    }

    [aspectratio][aspect-ratio="375/224"]:before {
      padding-top: 59.73333333333334%
    }

    [aspectratio][aspect-ratio="750/235"]:before {
      padding-top: 31.333333333333336%
    }

    [aspectratio][aspect-ratio="499/250"]:before {
      padding-top: 50.1002004008016%
    }

    [aspectratio][aspect-ratio="187/246"]:before {
      padding-top: 131.55080213903742%
    }

    [aspectratio-content] img {
      width: 100%;
      height: 100%;
      vertical-align: top
    }

    [w-369] {
      width: 49.2vw
    }

    ul[w-369]:nth-child(2n) {
      margin-left: 1.6vw
    }

    ul[w-369] li {
      background: #fff;
      margin-bottom: 1.6vw
    }

    [w-369] figcaption {
      padding: 2.66667vw
    }

    [w-369] figcaption div {
      font-size: 2.93333vw;
      color: #999
    }

    [w-369] h2 {
      margin: 0 0 4vw;
      font-size: 3.46667vw;
      color: #333;
      font-weight: 400
    }

    [w-369] span {
      color: #ff5000;
      font-size: 4.26667vw;
      margin-right: 2.66667vw
    }

    [w-369] h2 span {
      background: #ff5000;
      color: #fff;
      display: inline-block;
      border-radius: .53333vw;
      text-shadow: 0 .26667vw .26667vw #ff5000;
      padding: .26667vw .66667vw
    }

    [w-369] h2 span,
    [w-369] i {
      font-size: 2.66667vw;
      margin-right: .66667vw
    }

    [w-369] i {
      font-style: normal
    }

    [w-324-324] {
      width: 43.2vw;
      background: #fff
    }

    [aspectratio][aspect-ratio="324/324"]:before {
      padding-top: 100%
    }

    .block-5 li {
      background: #fff;
      border-bottom: 1px solid transparent;
      -o-border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2'%3E%3Crect width='100%25' height='50%25'/%3E%3C/svg%3E") 0 0 2 0 stretch;
      border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2'%3E%3Crect width='100%25' height='50%25'/%3E%3C/svg%3E") 0 0 2 0 stretch;
      margin-bottom: 2vw
    }

    .block-5 figcaption {
      -webkit-box-flex: 1;
      -ms-flex: 1;
      flex: 1;
      padding: 4vw
    }

    .block-5 h2 {
      font-size: 4.26667vw;
      font-weight: 400;
      margin: 0 0 2.66667vw
    }

    .block-5 figcaption div {
      font-size: 4vw;
      color: #999;
      overflow: hidden;
      text-overflow: ellipsis;
      word-break: break-all;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical
    }
  </style>
</head>

<body data-spm="mgi7t123d7">
  <div class="wrapper">
    <div class="container" flexcontainer="">
      <div class="banner" w-750-235="" aspectratio="" aspect-ratio="750/235">
        <div aspectratio-content="">
          <img src="./布局方案测试页面_files/TB2M_c0jmB0XKJjSZFsXXaxfpXa_!!82-0-luban.jpg_q50.jpg" alt="" width="100%" height="100%">
        </div>
      </div>
    </div>
    <div class="block block-2">
      <div class="container" flexcontainer="">
        <div class="block-item" w-375-224="" aspectratio="" aspect-ratio="375/224">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1gRq9SXXXXXcRXFXXXXXXXXXX-375-224.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-375-224="" aspectratio="" aspect-ratio="375/224">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1PMCHSXXXXXcQaXXXXXXXXXXX-375-224.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
      <div class="container" flexcontainer="">
        <div class="block-item" w-375-224="" aspectratio="" aspect-ratio="375/224">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1HsjfSXXXXXcFXpXXXXXXXXXX-375-224.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-375-224="" aspectratio="" aspect-ratio="375/224">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1qrvXSXXXXXakXFXXXXXXXXXX-375-224.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
    </div>
    <div class="block block-3">
      <div class="container" flexcontainer="">
        <div class="block-item" w-499-250="" aspectratio="" aspect-ratio="499/250">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1Jk6lSXXXXXXSXpXXXXXXXXXX-499-250.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-250-250="" aspectratio="" aspect-ratio="250/250">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB11E6hSXXXXXXlXpXXXXXXXXXX-250-250.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
      <div class="container" flexcontainer="">
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1N017SXXXXXcWXFXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1rC9DSXXXXXagapXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
      <div class="container" flexcontainer="">
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1SFqYSXXXXXcDXVXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB13DKESXXXXXarapXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
    </div>
    <div class="block block-3">
      <div class="container" flexcontainer="">
        <div class="block-item" w-750-250="" aspectratio="" aspect-ratio="750/250">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB17hvaSXXXXXahXFXXXXXXXXXX-750-250.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
      <div class="container" flexcontainer="">
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1t7CZSXXXXXcYXVXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-375-246="" aspectratio="" aspect-ratio="375/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1LoOOSXXXXXbPaXXXXXXXXXXX-375-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
      <div class="container" flexcontainer="">
        <div class="block-item" w-188-246="" aspectratio="" aspect-ratio="188/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1Ey5WSXXXXXcJXVXXXXXXXXXX-188-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-187-246="" aspectratio="" aspect-ratio="187/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1FuvcSXXXXXaCXFXXXXXXXXXX-187-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-188-246="" aspectratio="" aspect-ratio="188/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB1eDK5SXXXXXXgXVXXXXXXXXXX-188-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
        <div class="block-item" w-187-246="" aspectratio="" aspect-ratio="187/246">
          <div aspectratio-content="">
            <img src="./布局方案测试页面_files/TB16RKLSXXXXXb5aXXXXXXXXXXX-187-246.png" alt="" width="100%" height="100%">
          </div>
        </div>
      </div>
    </div>
    <div class="block block-4">
      <div class="container" flexcontainer="">
        <ul class="block-item" w-369="">
          <li>
            <figure>
              <img src="./布局方案测试页面_files/TB1eQR.SpXXXXbcaFXXXXXXXXXX-369-369.png" alt="" width="100%">
            </figure>
            <figcaption>
              <h2>荐形容的狠货厚高的工人的</h2>
              <div>
                <span>
                  <i>¥</i>21</span> 193人付款
              </div>
            </figcaption>
          </li>
        </ul>
        <ul class="block-item" w-369="">
          <li>
            <figure>
              <img src="./布局方案测试页面_files/TB1cuCrSpXXXXafaXXXXXXXXXXX-369-560.png" alt="" width="100%">
            </figure>
            <figcaption>
              <h2>
                <span class="bable">新品</span>荐形容的狠货厚高的工</h2>
              <div>
                <span>
                  <i>¥</i>21</span> 193人付款
              </div>
            </figcaption>
          </li>
        </ul>
      </div>
    </div>
    <div class="block block-5">
      <div class="container">
        <ul>
          <li flexcontainer="">
            <figure w-324-324="" aspectratio="" aspect-ratio="324/324">
              <div aspectratio-content="">
                <img src="./布局方案测试页面_files/TB26bQ_bb_0UKFjy1XaXXbKfXXa_!!642910327-0-beehive-scenes.jpg" alt="" width="100%" height="100%">
              </div>
            </figure>
            <figcaption>
              <h2>本来生活 牛油果</h2>
              <div>
                牛油果有“森林黄油”的美誉，是一种高蛋白、低脂肪的水果，也因此而倍受喜爱。本来生活选用优质进口牛油果，安全健康，营养价值非常高，其中富含植物纤维、不饱和脂肪酸等营养物质，非常适合妈妈宝宝食用。
              </div>
            </figcaption>
          </li>
          <li flexcontainer="">
            <figure w-324-324="" aspectratio="" aspect-ratio="324/324">
              <div aspectratio-content="">
                <img src="./布局方案测试页面_files/TB26bQ_bb_0UKFjy1XaXXbKfXXa_!!642910327-0-beehive-scenes.jpg" alt="" width="100%" height="100%">
              </div>
            </figure>
            <figcaption>
              <h2>本来生活 牛油果</h2>
              <div>
                牛油果有“森林黄油”的美誉，是一种高蛋白、低脂肪的水果，也因此而倍受喜爱。本来生活选用优质进口牛油果，安全健康，营养价值非常高，其中富含植物纤维、不饱和脂肪酸等营养物质，非常适合妈妈宝宝食用。
              </div>
            </figcaption>
          </li>
          <li flexcontainer="">
            <figure w-324-324="" aspectratio="" aspect-ratio="324/324">
              <div aspectratio-content="">
                <img src="./布局方案测试页面_files/TB26bQ_bb_0UKFjy1XaXXbKfXXa_!!642910327-0-beehive-scenes.jpg" alt="" width="100%" height="100%">
              </div>
            </figure>
            <figcaption>
              <h2>本来生活 牛油果</h2>
              <div>
                牛油果有“森林黄油”的美誉，是一种高蛋白、低脂肪的水果，也因此而倍受喜爱。本来生活选用优质进口牛油果，安全健康，营养价值非常高，其中富含植物纤维、不饱和脂肪酸等营养物质，非常适合妈妈宝宝食用。
              </div>
            </figcaption>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <!-- <script type="text/javascript" async="" src="./布局方案测试页面_files/index.js" id="aplus-sufei"></script> -->
  <!-- <script>
  !function(t){function e(i){if(r[i])return r[i].exports;var o=r[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var r={};e.m=t,e.c=r,e.i=function(t){return t},e.d=function(t,r,i){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=5)}([function(t,e,r){"use strict";r(4)},function(t,e,r){e=t.exports=r(2)(),e.push([t.i,'body,html{margin:0;padding:0}html{width:100vw;height:100vh}body{min-height:100%;background-color:#f4f4f4}*,:after,:before{box-sizing:border-box}li,ul{list-style:none outside none;margin:0;padding:0}figure{display:block;margin:0}img{width:100%;height:auto;vertical-align:top}[aspectratio]{position:relative}[aspectratio]:before{content:"";display:block;width:1px;margin-left:-1px;height:0}[aspectratio-content]{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%}[flexContainer]{display:-webkit-box;display:-ms-flexbox;display:flex;width:100vw}.block{margin-top:2vw}[w-750-235]{width:100vw}[w-375-224]{width:50vw}[w-499-250]{width:66.53333vw;padding-right:1px}[w-250-250]{width:33.33333vw}[w-375-246]{width:50vw}[w-750-250]{width:100vw}[w-188-246]{width:25.06667vw}[w-187-246]{width:24.93333vw}[aspectratio][aspect-ratio="188/246"]:before{padding-top:130.85106382978725%}[aspectratio][aspect-ratio="750/250"]:before{padding-top:33.33333333333333%}[aspectratio][aspect-ratio="375/246"]:before{padding-top:65.60000000000001%}[aspectratio][aspect-ratio="250/250"]:before{padding-top:100%}[aspectratio][aspect-ratio="375/224"]:before{padding-top:59.73333333333334%}[aspectratio][aspect-ratio="750/235"]:before{padding-top:31.333333333333336%}[aspectratio][aspect-ratio="499/250"]:before{padding-top:50.1002004008016%}[aspectratio][aspect-ratio="187/246"]:before{padding-top:131.55080213903742%}[aspectratio-content] img{width:100%;height:100%;vertical-align:top}[w-369]{width:49.2vw}ul[w-369]:nth-child(2n){margin-left:1.6vw}ul[w-369] li{background:#fff;margin-bottom:1.6vw}[w-369] figcaption{padding:2.66667vw}[w-369] figcaption div{font-size:2.93333vw;color:#999}[w-369] h2{margin:0 0 4vw;font-size:3.46667vw;color:#333;font-weight:400}[w-369] span{color:#ff5000;font-size:4.26667vw;margin-right:2.66667vw}[w-369] h2 span{background:#ff5000;color:#fff;display:inline-block;border-radius:.53333vw;text-shadow:0 .26667vw .26667vw #ff5000;padding:.26667vw .66667vw}[w-369] h2 span,[w-369] i{font-size:2.66667vw;margin-right:.66667vw}[w-369] i{font-style:normal}[w-324-324]{width:43.2vw;background:#fff}[aspectratio][aspect-ratio="324/324"]:before{padding-top:100%}.block-5 li{background:#fff;border-bottom:1px solid transparent;-o-border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' height=\'2\'%3E%3Crect width=\'100%25\' height=\'50%25\'/%3E%3C/svg%3E") 0 0 2 0 stretch;border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' height=\'2\'%3E%3Crect width=\'100%25\' height=\'50%25\'/%3E%3C/svg%3E") 0 0 2 0 stretch;margin-bottom:2vw}.block-5 figcaption{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:4vw}.block-5 h2{font-size:4.26667vw;font-weight:400;margin:0 0 2.66667vw}.block-5 figcaption div{font-size:4vw;color:#999;overflow:hidden;text-overflow:ellipsis;word-break:break-all;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var r=this[e];r[2]?t.push("@media "+r[2]+"{"+r[1]+"}"):t.push(r[1])}return t.join("")},t.i=function(e,r){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},o=0;o<this.length;o++){var n=this[o][0];"number"==typeof n&&(i[n]=!0)}for(o=0;o<e.length;o++){var a=e[o];"number"==typeof a[0]&&i[a[0]]||(r&&!a[2]?a[2]=r:r&&(a[2]="("+a[2]+") and ("+r+")"),t.push(a))}},t}},function(t,e){function r(t,e){for(var r=0;r<t.length;r++){var i=t[r],o=d[i.id];if(o){o.refs++;for(var n=0;n<o.parts.length;n++)o.parts[n](i.parts[n]);for(;n<i.parts.length;n++)o.parts.push(f(i.parts[n],e))}else{for(var a=[],n=0;n<i.parts.length;n++)a.push(f(i.parts[n],e));d[i.id]={id:i.id,refs:1,parts:a}}}}function i(t){for(var e=[],r={},i=0;i<t.length;i++){var o=t[i],n=o[0],a=o[1],s=o[2],f=o[3],c={css:a,media:s,sourceMap:f};r[n]?r[n].parts.push(c):e.push(r[n]={id:n,parts:[c]})}return e}function o(t,e){var r=g(),i=b[b.length-1];if("top"===t.insertAt)i?i.nextSibling?r.insertBefore(e,i.nextSibling):r.appendChild(e):r.insertBefore(e,r.firstChild),b.push(e);else{if("bottom"!==t.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");r.appendChild(e)}}function n(t){t.parentNode.removeChild(t);var e=b.indexOf(t);e>=0&&b.splice(e,1)}function a(t){var e=document.createElement("style");return e.type="text/css",o(t,e),e}function s(t){var e=document.createElement("link");return e.rel="stylesheet",o(t,e),e}function f(t,e){var r,i,o;if(e.singleton){var f=w++;r=v||(v=a(e)),i=c.bind(null,r,f,!1),o=c.bind(null,r,f,!0)}else t.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=s(e),i=l.bind(null,r),o=function(){n(r),r.href&&URL.revokeObjectURL(r.href)}):(r=a(e),i=p.bind(null,r),o=function(){n(r)});return i(t),function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap)return;i(t=e)}else o()}}function c(t,e,r,i){var o=r?"":i.css;if(t.styleSheet)t.styleSheet.cssText=m(e,o);else{var n=document.createTextNode(o),a=t.childNodes;a[e]&&t.removeChild(a[e]),a.length?t.insertBefore(n,a[e]):t.appendChild(n)}}function p(t,e){var r=e.css,i=e.media;if(i&&t.setAttribute("media",i),t.styleSheet)t.styleSheet.cssText=r;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(r))}}function l(t,e){var r=e.css,i=e.sourceMap;i&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */");var o=new Blob([r],{type:"text/css"}),n=t.href;t.href=URL.createObjectURL(o),n&&URL.revokeObjectURL(n)}var d={},u=function(t){var e;return function(){return void 0===e&&(e=t.apply(this,arguments)),e}},h=u(function(){return/msie [6-9]\b/.test(self.navigator.userAgent.toLowerCase())}),g=u(function(){return document.head||document.getElementsByTagName("head")[0]}),v=null,w=0,b=[];t.exports=function(t,e){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");e=e||{},void 0===e.singleton&&(e.singleton=h()),void 0===e.insertAt&&(e.insertAt="bottom");var o=i(t);return r(o,e),function(t){for(var n=[],a=0;a<o.length;a++){var s=o[a],f=d[s.id];f.refs--,n.push(f)}if(t){r(i(t),e)}for(var a=0;a<n.length;a++){var f=n[a];if(0===f.refs){for(var c=0;c<f.parts.length;c++)f.parts[c]();delete d[f.id]}}}};var m=function(){var t=[];return function(e,r){return t[e]=r,t.filter(Boolean).join("\n")}}()},function(t,e,r){var i=r(1);"string"==typeof i&&(i=[[t.i,i,""]]);r(3)(i,{});i.locals&&(t.exports=i.locals)},function(t,e,r){t.exports=r(0)}]);
    </script>  -->
  <!--
  <script>
  (function(){
  	var windowWidth = window.innerWidth;
    var widthDevice = window.screen.width;
    var viewWidth= document.documentElement.clientWidth;
    var devicePixelRatio = window.devicePixelRatio;
    
    alert("windowWidth: " + windowWidth + ",widthDevice: " + widthDevice + ", viewWidth: " + viewWidth + ", devicePixelRatio: " + devicePixelRatio);
    
  })();
  </script>
-->
  <!-- <script src="./布局方案测试页面_files/aplus_wap.js"></script> -->

</body>

</html>